<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>小米商城-为发烧而生_购物车</title>
    <link
      rel="shortcut icon"
      href="//s01.mifile.cn/favicon.ico"
      type="image/x-icon"
    />
    <link rel="stylesheet" href="/libs/swiper/css/swiper.css" />
    <link rel="stylesheet" href="/libs/font-awesome/css/font-awesome.css" />
    <link rel="stylesheet" href="/css/ShoppingCart.css" />
  </head>
  <body>
    <div class="xiaomi">
      <!--  <header></header> -->

      <!-- 内容 -->
      <section>
        <div class="titles">
          <div class="contents">
            <p class="pr" style="display: flex;justify-content: space-between;">
              <a href="/index.html"
                ><img src="/images/mistore_logo.png" alt=""
              /></a>
              <b
                href=""
                style="color: #424242; font-size: 24px;line-height:97px;font-weight: bold;"
                >购物车</b
              >
            </p>
          </div>
        </div>
        <div class="Shop" id="shopping_car">
          <div class="contents">
            <div class="Shop_top">
              <div class="sub_top">
                <input type="checkbox" class="quanxuan" id="all-check" />全选
              </div>
              <div class="sub_shangp">商品名称</div>
              <div class="sub_top">价格</div>
              <div class="sub_top">数量</div>
              <div class="sub_top ">小计</div>
              <div class="sub_top">操作</div>
              <div class="clear"></div>
            </div>
            <hr />
            <div class="ShopList">
              <ul id="shop_tbody"></ul>

              <script type="text/html" id="srcShop">
                {{each cartList shop}}
                <li data-id="{{shop.id}}" class="shopping">
                  <input type="checkbox" class="checks" {{shop.check?'checked':''}} />
                  <a href="/html/details.html?id={{shop.id}}">
                    <img
                      src="{{shop.imgs[0]}}"
                      width="80"
                      height="80"
                      alt=""
                    />
                    <b>{{shop.title.length > 10 ? shop.title.slice(0,10)+'...' : shop.title}}</b>
                  </a>
                  <i>{{shop.price}}</i>
                  <div class="number">
                    <a href="javaScript:;" class="minus">-</a>
                    <input type="text" value="{{shop.count}}" class="Counts">
                    <a href="javaScript:;" class="plus">+</a>
                  </div>
                  <div class="xiaoji">
                    {{shop.count*shop.price}}
                  </div>
                  <div class="caozuo">
                    <i class="fa fa-window-close-o del"></i>
                  </div>
                </li>
                {{/each}}
              </script>
            </div>
          </div>
          <div class="huizong">
            <div class="contents">
              <div class="huizong_left">
                <b>
                  <a href="/html/list.html">继续购物</a>共<i id="ShopCount">
                    <!-- {{shop.count}} --> </i
                  >件商品</b
                >
                <div class="heji">
                  <p>
                    合计：<b id="Paymoney">
                      <!-- {{(shop.price * shop.count).toFixed(2)}} --> </b
                    >元
                  </p>
                  <div class="jiesuan">
                    <a href="">去结算</a>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="kong" id="cart-empty">
          <i class="fa fa-meh-o"></i>
          <p>您的购物车空空如也</p>
        </div>
      </section>
      <!-- 内容结束 -->

      <footer></footer>
    </div>
    <script
      src="/libs/require/require.min.js"
      data-main="/js/ShoppingCart"
    ></script>
  </body>
</html>
